//todo —— Props
//!概念： 如果说state是组件的内部状态，那么props就是外部状态
//! 无状态组件其实是没有内部状态的(没有state)。

class App extends React.Component {
  render() {
    const {name} = this.props
    return (
      <h1>{name}</h1>
    )
  }
}

// props 从标签属性上来 类似id，class一样，通过this.props可以拿到
// props => 组件的外部状态
ReactDom.render(<App name="我是props1" />, document.getElementById("root"))

// *——————————————————————————————————————————————————————————————

  //todo 无状态组件里面，通过外部去传入数据/状态，props是通过参数传入的
  function Count(props) {
    //* 无状态组件里面，props是通过参数传入的
    return (
      <div className='count'>{props.count}</div>
    )
  }
  
  
  class App extends React.Component {
    render() {
      // const {name} = this.props
      return (
        <h1><Count count="1"></Count></h1>
      )
    }
  }
  
  // props 从标签属性上来 类似id，class一样，通过this.props可以拿到
  // props => 组件的外部状态
  ReactDom.render(<App name="我是props1" />, document.getElementById("root"))